<template>
	<view class="all-main">
		<view class="main">
			<view class="top"></view>
			<view class="centers">
				<view class="img" @click="pageTo(1)">
					<text>直接进件 ></text>
				</view>
			</view>
			<view class="items" @click="pageTo(2)">
				<view class="left">
					<text>草稿箱</text>
					<u-icon name="arrow-right"></u-icon>
				</view>
				<view class="right">
					<u-icon name="file-text" size="36" color="#f2873a"></u-icon>
				</view>
			</view>
			<view class="items" @click="pageTo(3)">
				<view class="left">
					<text>审核管理</text>
					<u-icon name="arrow-right"></u-icon>
				</view>
				<view class="right">
					<u-icon name="order" size="36" color="#f2873a"></u-icon>
				</view>
			</view>
			<view class="btns">
				<view class="btn-box" @click="closePage">
					<u-icon name="close" size="36"></u-icon>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		onReady() {
			uni.hideNavigationBarLoading(); // 如果是在加载时隐藏导航栏加载提示，用这个方法
		},
		methods: {
			// 页面跳转
			pageTo(type) {
				if (type == 1) {
					uni.navigateTo({
						url: '/pages/index/guotong/index'
					})
				} else if (type == 2) {
					uni.navigateTo({
						url: '/pages/index/guotong/drafts?type=2'
					})
				} else if (type == 3) {
					uni.navigateTo({
						url: '/pages/index/guotong/order'
					})
				}
			},
			// 关闭页面
			closePage() {
				uni.reLaunch({
				    url: '/pages/index/index'
				});
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #ffffff; /* 设置背景颜色 */
	}
	.all-main {
		.main {
			.top {
				background: url('@/static/gt_top.jpg');
				height: 600rpx;
			}
			
			.centers {
				.img {
					margin: 0 30rpx;
					background-image: url('@/static/gt_cen.png');
					background-repeat: repeat;
					background-size: 100% 100%;
					height: 220rpx;
					display: flex;
					align-items: center;
					
					text {
						font-size: 46rpx;
						color: #ffffff;
						padding-left: 50rpx;
						padding-top: 30rpx;
					}
				}
			}
			
			.items {
				margin: 50rpx 30rpx 0 30rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				padding: 30rpx;
				border-radius: 16rpx;
				background-color: #fef5f0;
				
				.left {
					display: flex;
					align-items: center;
				}
			}
			
			.btns {
				margin: 50rpx 30rpx;
				display: flex;
				justify-content: center;
				
				.btn-box {
					width: 150rpx;
					height: 150rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					background-color: #f7f7f7;
					border-radius: 50%;
				}
			}
		}
	}
</style>
